import React, { Component } from 'react';
import { Message, Form, Radio, Input, Loading } from '@alifd/next';
import Uploader from '../../../components/Uploader';
import request from '../../../utils/request';

const FormItem = Form.Item;

export default class ImgManager extends Component {
  static displayName = 'ImgManager';

  constructor(props) {
    super(props);
    const categories = [
      { value: '笑话', label: '笑话' },
      { value: 'cosplay', label: 'cosplay' },
      { value: '动漫图片', label: '动漫图片' },
      { value: '人物', label: '人物' },
      { value: '风景', label: '风景' },
      { value: '壁纸', label: '壁纸' },
    ];
    this.state = {
      categories,
      selectCategory: categories[0].value,
      loading: false,
      pictureItems: [],
      detailData: {},
    };
  }

  componentDidMount() {
    this.getDetail(this.props.match.params.id);
    console.log('this.props.params', this.props.match.params.id);
  }

  handleSubmit = (data, validate) => {
  }

  render() {
    const { loading, categories, selectCategory, detailData, pictureItems } = this.state;
    return (
      <div className="card-bg">
        <Loading visible={loading} shape="fusion-reactor" style={{ display: 'block' }}>
          <Form style={{ width: '60%' }}>
            <FormItem label="图片">
              <Uploader ref="uploader" value={pictureItems} detailId={detailData.id} authorId={detailData.author} />
            </FormItem>
          </Form>
        </Loading>
      </div>
    );
  }
}
